import React from 'react'
import { SearchBar, Grid, Tag, Tabs, Empty } from 'antd-mobile'

import swipers from '../../../../assets/img/swiper1.png'
import allbuy1 from '../../../../assets/img/allbuy1.png'
import allbuy2 from '../../../../assets/img/addbuy.png'
import './Goods.less'
import { Link, withRouter } from 'react-router-dom'
import { imgPre } from '../../../../request/http'
function Goods(props) {
  let { showGoods, n, changeN } = props
  var arr = ['热门商品', '打折商品', '全部商品']
  // console.log(goods, n);
  return (
    <div>

      <div className='all'>
        <div className="nav1">
          {arr.map((item, index) => {
            return (
              <span key={item}
                className={index == n ? 'active' : ''}
                onClick={() => { changeN(index) }}
              >{item}</span>
            )
          })}
         
        </div>
       

        {showGoods.length > 0 ? <div className='sTimeShop'>
          {
            showGoods[n].content.map((item,index) => {
              return (
                <div className='sTimeShop' key={item.id}>
                  <Link to={"/detail/" + item.id} >
                    <img src={imgPre + item.img} alt="" />
                    <div className="detail">
                      <h4> <Tag color='warning'>7.9折</Tag>{item.goodsname}</h4>
                      <div className='long'><img src={allbuy1} alt="" /><span>直降198元</span><b>限购一件</b></div>
                      <span>
                        <p>￥{item.price} <i>￥{item.market_price}</i></p>
                        <img src={allbuy2} alt="" />
                      </span>
                    </div>
                  </Link>
                </div>
              )
            })
          }
        </div> : <Empty>暂无数据</Empty>}
      </div>
    </div>
  )
}
export default withRouter(React.memo(Goods))
